<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <input id="stack-input" type="text">
    <p id="stack-cont">栈内容：apple-&gt;pear</p>
    <button id="push-btn">进栈</button>
    <button id="pop-btn">退栈</button>
    <button id="font-btn">打印栈顶元素内容</button>
    <button id="empty-btn">判断栈是否为空</button>

    <script>
        var stack = ["apple", "pear"];

        function Stack(stack) {
            this.push = function(item) {
                stack.push(item);
            };
            this.pop = function(item) {
                return stack.pop(item);
            };
            this.peek = function() {
                return stack[stack.length - 1];
            };
            this.isEmpty = function() {
                return stack.length === 0;
            };
            this.print = function() {
                console.log(stack);
            }
            this.updateP = function() {
                var p = document.getElementById('stack-cont');
                p.innerHTML = '栈内容：' + stack.join('->');
            }
        }
        var btns = document.querySelectorAll('button');
        var myStack = new Stack(stack);
        btns[0].onclick = function() {
            var input = document.getElementById('stack-input').value;
            myStack.push(input);
            myStack.updateP();
        }
        btns[1].onclick = function() {
            myStack.pop();
            myStack.updateP();
        };
        btns[2].onclick = function() {
            console.log(myStack.peek());
        };
        btns[3].onclick = function() {
            if (myStack.isEmpty()) {
                console.log('栈为空');
            } else {
                console.log('栈不空');
            }
        };
        // 按大小排序
        var arr = [43, 54, 4, -4, 84, 100, 58, 27, 140];
        arr.sort(function(a, b) {
            return a - b;
        });
        console.log(arr);
        arr.sort(function(a, b) {
            return b - a;
        });
        console.log(arr);
        // 按字母序
        arr = ['apple', 'dog', 'cat', 'car', 'zoo', 'orange', 'airplane'];
        arr.sort(function(a, b) {
            return a.localeCompare(b);
        });
        console.log(arr);
        arr.sort(function(a, b) {
            return b.localeCompare(a);
        });
        console.log(arr);
        // 将上面的二维数组，按照每个元素中第二个数从大到小的顺序进行排序输出，输出结果应该为：
        arr = [
            [10, 14],
            [16, 60],
            [7, 44],
            [26, 35],
            [22, 63]
        ]; //[[22, 63], [16, 60], [7, 44], [26, 35], [10, 14]]
        arr.sort(function(a, b) {
            return b[1] - a[1];
        });
        console.log(arr);
        // 按value值排序
        arr = [{
            id: 1,
            name: 'candy',
            value: 40
        }, {
            id: 2,
            name: 'Simon',
            value: 50
        }, {
            id: 3,
            name: 'Tony',
            value: 45
        }, {
            id: 4,
            name: 'Annie',
            value: 60
        }];
        arr.sort(function(a, b) {
            return a.value - b.value;
        });
        console.log(arr);
    </script>
</body>

</html>